import React, { Component } from 'react'
import { hashHistory } from 'react-router'
import { Button, InputItem, Toast, Switch } from 'antd-mobile'
import { createForm } from 'rc-form'
import { defineMessages, intlShape, injectIntl, FormattedMessage } from 'react-intl'
import { config, helper, myFetch } from '../utils'

const messages = defineMessages({
    placeholderOne: {
      id: 'placeholder',
      defaultMessage: '请输入'
    }
});

class RealLogin extends Component {
  login = () => {
    const { getFieldValue } = this.props.form
    let mobile = getFieldValue('mobile')
    let password = getFieldValue('password')
    mobile = mobile.replace(/(^\s*)|(\s*$)/g,'')
    password = password.replace(/(^\s*)|(\s*$)/g,'')
     //console.log(mobile)
    if (!mobile) {
      Toast.fail('请输入账户号码', 1.2)
      return
    }
    if (mobile.length < 7 || mobile.length > 10) {
      Toast.fail('帐号长度位数为7-10位', 1.2)
      return
    }
    if (!password) {
      Toast.fail('请输入密码', 1.2)
      return
    }
    if (password.length > 32) {
      Toast.fail('密码长度不得大于32位', 1.2)
      return
    }
    const options = {
      method: 'POST',
      body: JSON.stringify({
        ID: mobile,
        PASS: password
      })
    }
    myFetch(`${config.rootApi}/mLogin`, options)
    .then((rs) => {
      if (rs) {
        //console.log(rs)
        localStorage.setItem('token', rs.sessionId)
        //this.onRatelist()
        this.onInit()
        Toast.success('登录成功', 1.2, () => {
          hashHistory.push('/trade')
        })
      }
    })
  }
  onInit = () => {
    const options = {
      method: 'POST'
    }
    myFetch(`${config.rootApi}/mInit`, options, true)
    .then((rs) => {
      console.log(rs, 'us')
      if (rs && rs.dataInfoInitCcypair && rs.dataInfoInitCcypair.dataListInitCcypairs) {
        localStorage.setItem('init', JSON.stringify(rs.dataInfoInitCcypair.dataListInitCcypairs))
        let arr = rs.dataInfoInitCcypair.dataListInitCcypairs
        let result = []
        arr.map((val, index) => {
          let obj = Object.assign({}, {id: index, ccyPair: val.ccyPair})
          result.push(obj)
        })
        if (!localStorage.all && !localStorage.ccy) {
          //console.log('app2')
          localStorage.setItem('all', JSON.stringify(result))
          localStorage.setItem('ccy', JSON.stringify(result))
        }
      }
    })
  }
  /*onRatelist = () => {
    const options = {
      method: 'POST'
    }
    myFetch(`${config.rootApi}/mRatelist`, options, true)
     .then((rs) => {
       if (rs && rs.dataInfoRate && rs.dataInfoRate.dataListRates) {
           let arr = rs.dataInfoRate.dataListRates
           let result = []
           arr.map((val, index) => {
             let obj = Object.assign({}, {id: index, ccyPair: val.ccyPair})
             result.push(obj)
           })
           //console.log('app1')
           if (!localStorage.all && !localStorage.ccy) {
             //console.log('app2')
             localStorage.setItem('all', JSON.stringify(result))
             localStorage.setItem('ccy', JSON.stringify(result))
           }
         }
     })
  }*/
  render() {
    const { getFieldProps } = this.props.form
    const str = this.props.intl.formatMessage(messages.placeholderOne, {name: '密码'})
    const account = this.props.intl.formatMessage(messages.placeholderOne,{name:'账户号码'} )
    return (
        <div className="rt-home-page">
          <header className="-header">
            <img src={require('static/images/logo-h.png')}/>
          </header>
          <div className="body">
              <p className="-real">
                <FormattedMessage
                 id="simulatedaccount"
                />
              </p>
              <InputItem
              type="text"
              {...getFieldProps('mobile', {
                initialValue: '',
              })}
              placeholder={account}
              clear
            />
            <div className="password-box">
              <InputItem
             className="-password"
              type="password"
              {...getFieldProps('password', {
                initialValue: '',
              })}
              placeholder={str}
              clear
             />
             <Switch
                {...getFieldProps('Switch2', {
                  initialValue: false,
                  valuePropName: 'checked',
                })}
                onClick={(checked) => { console.log(checked); }}
              />
              <p>
                <FormattedMessage
                 id="rememberpassword"
              />
              </p>
            </div>
            <Button onClick={(e)=>this.login()} className="rt-login">
              <FormattedMessage
                 id="login"
              />
            </Button>
            <span className="rt-forgot">
              <span>
                <FormattedMessage
                 id="forgotPassWord"
              />
              </span>
              <span>
                <FormattedMessage
                 id="openAccount"
                />
              </span>
            </span>
            <p className="rt-cancel">
              <FormattedMessage
                 id="cancel"
              />
            </p>
          </div>
        </div>
      )
  }
}
RealLogin.propType = {
  intl: intlShape.isRequired
}
export default injectIntl(createForm()(RealLogin))
